Infinite scrolling eli loputon vieritys on herkästi turhauttava ja jopa raivostuttava navigointimenettely. Se toimii joissain yhteyksissä, mutta sen kanssa on syytä olla varovainen. Etenkin arkistosivuilla suosittelen lämpimästi käyttämään perinteistä sivutettua arkistoa loputtoman skrollauksen sijasta.
Löysin kuitenkin sille ihan mielenkiintoisen sovelluksen. Pitchforkin levyarvosteluissa arvostelun lopussa näytetään automaattisesti edellinen arvostelu aikajärjestyksessä. Tämä on mielestäni aika toimiva sovellus: jos googlailee jotain tiettyä arvostelua ja sen löytää ja lukee, lisäsisällöstä ei tarvitse välittää, mutta joskus kohdalle voi osua jotain kiinnostavaa, joka houkutteleekin lukemaan.
Levyarvostelujen kaltaisessa sisällössä tällainen sattumanvarainen uuden luettavan kohtaaminen toimii oikein hyvin. Varsinkin kun toteutus on sikäli toimiva, että kun uuden jutun kohdalle skrollaa, selaimen osoitepalkkiin vaihtuu uuden artikkelin osoite, jolloin pysyvien linkkien tekeminen haluttuun sisältöön on helppoa.
Tuumin, toimisiko samanlainen ratkaisu Kirjavinkkien arvosteluissa – siellä samankaltaisen sisällön tarjoaminen luettavaksi voisi olla hyvä idea, kirja-arvosteluissa ”ai tällaistakin on”-ilmiö olisi tervetullut. Tehtävään on tarjolla valmiita plugineita, mutta pikaisella katsauksella ne eivät vakuuttaneet. Vaan eihän tämä voi olla vaikea tehdä itse…
No, ei se ollutkaan, ja parin aamupäivän pakerruksen lopputuloksen paketoin Infinite Post Scroll -pluginiksi. Kyseessä ei ole ihan asenna ja aktivoi -tasoisen helppo juttu, vaan pluginin käyttöönotto vaatii vähän koodin parissa askarointia, johtuen lähinnä tehtävän luonteesta – jokainen sivusto on erilainen, joten jotta ladattava lisäsisältö saadaan näyttämään oikealta, vaaditaan aika lailla kustomointia.
Lopputulos oli mielenkiintoinen sekoitus javascriptiä ja konepellin alla tapahtuvaa AJAX-koodia. Ensimmäinen uusi artikkeli ladataan sivun loppuun välittömästi, kun sivu avataan. Sitten kun ikkunaa skrollaillaan, uuden artikkelin tullessa kohdalle vaihdetaan selaimen osoitepalkkiin tämän artikkelin osoite ja seuraava artikkeli ladataan heti, jolloin se löytyy jutun lopusta ilman odottelua.
Sisältöä olisi kenties voinut hakea REST API:n avulla, mutta totesin paremmaksi ratkaisuksi rakennella oma AJAX-toiminto, joka saa parametrinä artikkelin ID-numeron ja palauttaa edellisen artikkelin sisällön suoraan oikean mallisena HTML-koodina, jolloin se voidaan vain lisätä suoraan sivulle. Tämä mahdollistaa sen, että sisältöön on mahdollista sovittaa kaikenlaista palikkaa, esimerkiksi ACF-kenttiä, taksonomiatermejä, Relevanssin Related posts -listoja ja niin edelleen.
Tämä ratkaisu ei varmastikaan sovellu ihan vaativimpaan käyttöön – se ei esimerkiksi tee minkäänlaista siivoamista, eli jos skrollailee tarpeeksi pitkään, sivusta kasvaa niin iso, että ongelmia tullee varmasti. En tosin tiedä yhtään, kuinka paljon pitäisi skrollailla, jotta saisi vaikeuksia.
GitHub-reposta löytyy perinpohjaiset asennusohjeet ja koodia on kommentoitu ja dokumentoitu hyvin, joten siitä vain tutkailemaan – kysymyksiä ja parannusehdotuksia otetaan vastaan, niitä sopii esittää täällä tai GitHubin issueissa.
Jos haluat nähdä, miltä tämä käytännössä näyttää, lähde vaikka tästä Kirjavinkkien vinkistä ja skrollaile alaspäin.